/**
 * Created by Administrator on 2017/3/21.
 */
import React, { Component } from 'react';
import { Form, Button, Badge, Select, DatePicker, Radio, Descriptions, Input, Typography, Icon } from 'antd';
import { connect } from 'dva';
import moment from 'moment';
import request from '@/utils/request';
import { download, leaveStatue,leaveStatueImg } from '@/utils/utils';
import config from '@/config/config';

const { Paragraph } = Typography;
const { TextArea } = Input;
const { Option } = Select;

const ButtonGroup = Button.Group;

class AddPoliciesForm extends Component {
  constructor(props) {
    super(props);
    this.state = {
      fileList: [],
      all_users: [],
      format: 'YYYY-MM-DD',
    };
  }

  render() {
    const { getFieldDecorator } = this.props.form;
    const editRecord = this.props.editRecord;

    let statusColor1=''
    let statusColor2=''
    if(editRecord.status===3||editRecord.status===5){
      statusColor1='#c60600'
    }else if(editRecord.status===4||editRecord.status===6){
      statusColor1='#1e9680'
    }
    if(editRecord.status===5){
      statusColor2='#c60600'
    }else if(editRecord.status===6){
      statusColor2='#1e9680'
    }
    return (
      <div>
        <Form>
          {leaveStatueImg(this.props.editRecord.status)}
          <Descriptions className={'blue-descriptions'} title={<div style={{ textAlign: 'center' }}>请假详情</div>}
                        bordered>
            <Descriptions.Item label="申请人">
              {this.props.editRecord.staff_name}
            </Descriptions.Item>
            <Descriptions.Item label="请假类型">
              {this.props.editRecord.type}
            </Descriptions.Item>


            <Descriptions.Item label="时间粒度">
              {this.props.editRecord.time_granularity === 1 ? '天' : '小时'}
            </Descriptions.Item>
            <Descriptions.Item label="开始时间">
              {this.props.editRecord.start_time}
            </Descriptions.Item>
            <Descriptions.Item label="结束时间">
              {this.props.editRecord.end_time}
            </Descriptions.Item>
            {this.props.editRecord.time_granularity === 1 ?
              <Descriptions.Item label="请假时长">
                {this.props.editRecord.days}天
              </Descriptions.Item> :
              <Descriptions.Item label="请假时长">
                {this.props.editRecord.hours}小时
              </Descriptions.Item>}

            <Descriptions.Item label="请假事由" span={3} style={{ whiteSpace: 'wrap' }}>
              <Paragraph style={{ fontWeight: 'bold', color: '#000' }} ellipsis={{ rows: 3, expandable: true }}>
                {this.props.editRecord.cause}
              </Paragraph>
            </Descriptions.Item>
            <Descriptions.Item label="请假附件" span={3}>
              {
                this.props.editRecord.attachments.map((item, index) => {
                  return <div>
                    <Button type={'primary'} key={index} onClick={() => {
                      download(`${config.prefix}/leave_lists/${this.props.editRecord.id}/attachments/${item.key}/download?token=Bearer ${sessionStorage.getItem('token')}`);
                    }
                    }>点击下载附件</Button> {item.name}

                  </div>;
                })
              }
            </Descriptions.Item>

            <Descriptions.Item label="状态" span={3}>
              {leaveStatue(this.props.editRecord.status)}
            </Descriptions.Item>
            <Descriptions.Item label="审批人" span={1}>
              <div style={{color:statusColor1}}>  {this.props.editRecord.reviewer_name}</div>
            </Descriptions.Item>
            <Descriptions.Item label="审批时间" span={1}>
              <div style={{color:statusColor1}}>  {this.props.editRecord.review_time}</div>
            </Descriptions.Item>
            <Descriptions.Item label="审批备注" span={3}>
              <div style={{color:statusColor1}}>  {this.props.editRecord.review_remark}</div>
            </Descriptions.Item>

            <Descriptions.Item label="复审人" span={1}>
              <div style={{color:statusColor2}}>{this.props.editRecord.rehearer_name}</div>
            </Descriptions.Item>
            <Descriptions.Item label="复审时间" span={1}>
              <div style={{color:statusColor2}}> {this.props.editRecord.rehear_time}</div>
            </Descriptions.Item>
            <Descriptions.Item label="复审备注" span={3}>
              <div style={{color:statusColor2}}> {this.props.editRecord.rehear_remark}</div>
            </Descriptions.Item>
          </Descriptions>
        </Form>

      </div>
    );
  }
}

const AddPoliciesFormWrap = Form.create()(AddPoliciesForm);
export default connect()(AddPoliciesFormWrap);


